@import "base/base";

div.questionmanger{
    margin-top: 20px;
    div#manger-question-tabs{
        ul.am-tabs-nav{
            background-color: #EEE;
            border: 1px #E0E0E0 solid;
            li.am-active > a{
                border: none;
                border-top: 2px white solid;
            }
            a{
                font-size: 0.9em;
                @include link-colors(#000,#000,#000,#000,#000);
            }
        }
        
        div.am-tab-panel{
            padding-right:0 ;
            padding-left: 0;
            background-color: white;
            height: 500px;
            overflow-y: auto;
            ul.my-panel-ul{
                padding: 0;
                list-style: none;
                li{
                    $backColor : #FFA017;
                    $paddingRL : 40px;
                    padding: 7px $paddingRL;
                    outline : 1px #E7E7E7 solid;
                    &:hover{
                        $hoverBorderLeft : 12px;
                        border-left: $hoverBorderLeft $backColor solid;
                        padding-left: $paddingRL - $hoverBorderLeft;
                    }
                    &.active{
                        background-color: $backColor;
                        color: white;
                    }
                }
            }
        }
        
    }
    
    div.manger-question-detail{
        height: 537.5px;
        >div.pointer{
            width: 2%;
            height: 100%;
            float: left;
            color: black;
            font-size: 2.1em;
            padding-top: 35px;
            @include transition(padding-top 0.3s);
        }
        >div.content{
            float: left;
            height: 100%;
            width: 98%;
            background-color: white;
            border-left: 3px black solid;
            div.titleArea{
                margin: 0 auto;
                height: 50px;
                line-height: 50px;
                width: 90%;
                color: #888;
                font-size: 20px;
                border-bottom: 2px #838383 dotted;
                button{
                    float: right;
                    margin: 10px 8px;
                    font-size: 0.8em;
                    color: #fff;
                    background-color: #FFA017;
                    border-color: #FFA017;
                    border-radius: 8px;
                    padding: 5px 10px;
                }
            }
            div.contentArea{
                div.questions{
                    padding: 20px ;
                    div.item{
                        display: inline-block;
                        position: relative; 
                        overflow: hidden;
                        width:112px; 
                        &:hover{
                            .title{
                                 left:-80px;
                            }
                        }
                        div.title{
                            @include border-radius(5px);
                            padding: 0 16px;
                            /*height: 2em;*/
                            line-height: 2em;
                            position: absolute;
                            top: 0;
                            left: 0;
                            background-color: #F1F1F1;
                            @include transition(left 0.3s);
                        }
                        div.button{
                            color: white;
                            height: 2.2em;
                            line-height: 2.2em;
                            @include border-radius(8px);
                            font-size: 0.85em;
                            padding: 0 16px;
                            text-align: right;
                            background-color: #D42C4C;
                            a{
                                @include link-colors(#fff,#fff,#fff,#fff,#fff);
                            }
                        }
                    }
                }
                div.tree{
                    span.hoverArea{
                        display: none;
                        float: right;
                        font-size: 0.85em;
                        line-height: 25px;
                        a{
                            padding-left: 15px;
                        }
                    }
                    li.parent_li>span:hover{
                        span.hoverArea{
                            display: block;
                        }
                    }
                }
                
            }
        }
        
        
        
    }
}
